summaryrefslogtreecommitdiff
path: root/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies
diff options
context:
space:
mode:
authorFabian Mastenbroek <mail.fabianm@gmail.com>2022-10-27 11:36:19 +0200
committerFabian Mastenbroek <mail.fabianm@gmail.com>2022-10-27 11:38:06 +0200
commitd40772d2b54040a851223575e8c99eda4567f3a3 (patch)
tree8b72f12998c18636f79944ab9ed1f4503ce8e068 /opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies
parent18b7ec85dde70ae0bd74d638d573daeaf3e4365f (diff)
build(web/ui): Update to Next 13 and React 18
This change updates the web interface to use Next 13 and React 18. This release has a couple breaking changes (related to links) which we have fixed accordingly.
Diffstat (limited to 'opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies')
-rw-r--r--opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js17
1 files changed, 6 insertions, 11 deletions
diff --git a/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js b/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js
index d3892710..48359365 100644
--- a/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js
+++ b/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js
@@ -22,12 +22,13 @@
import dynamic from 'next/dynamic'
import { useRouter } from 'next/router'
+import Head from 'next/head'
+import Link from 'next/link'
import ContextSelectionSection from '../../../../components/context/ContextSelectionSection'
import TopologySelector from '../../../../components/context/TopologySelector'
import TopologyOverview from '../../../../components/topologies/TopologyOverview'
import { useDispatch } from 'react-redux'
import React, { useEffect, useState } from 'react'
-import Head from 'next/head'
import { AppPage } from '../../../../components/AppPage'
import {
Breadcrumb,
@@ -42,7 +43,6 @@ import {
Text,
TextContent,
} from '@patternfly/react-core'
-import BreadcrumbLink from '../../../../components/util/BreadcrumbLink'
import { useTopology } from '../../../../data/topology'
import { goToRoom } from '../../../../redux/actions/interaction-level'
import { openTopology } from '../../../../redux/actions/topology'
@@ -58,7 +58,6 @@ function Topology() {
const topologyNumber = +router.query['topology']
const { data: topology } = useTopology(projectId, topologyNumber)
- const project = topology?.project
const dispatch = useDispatch()
useEffect(() => {
@@ -71,17 +70,13 @@ function Topology() {
const breadcrumb = (
<Breadcrumb>
- <BreadcrumbItem to="/projects" component={BreadcrumbLink}>
+ <BreadcrumbItem to="/projects" component={Link}>
Projects
</BreadcrumbItem>
- <BreadcrumbItem to={`/projects/${projectId}`} component={BreadcrumbLink}>
+ <BreadcrumbItem to={`/projects/${projectId}`} component={Link}>
Project details
</BreadcrumbItem>
- <BreadcrumbItem
- to={`/projects/${projectId}/topologies/${topologyNumber}`}
- component={BreadcrumbLink}
- isActive
- >
+ <BreadcrumbItem to={`/projects/${projectId}/topologies/${topologyNumber}`} component={Link} isActive>
Topology
</BreadcrumbItem>
</Breadcrumb>
@@ -96,7 +91,7 @@ function Topology() {
return (
<AppPage breadcrumb={breadcrumb} contextSelectors={contextSelectors}>
<Head>
- <title>{project?.name ?? 'Topologies'} - OpenDC</title>
+ <title>{`${topology?.name ?? 'Topologies'} - OpenDC`}</title>
</Head>
<PageSection variant={PageSectionVariants.light}>
<TextContent>